<%
  ajax ||= false
  redirect_url ||= '#'
  classes ||= ''
%>
<% payment_method ||= (@payment_method || Samurai::PaymentMethod.new) %>
<form action="<%= Samurai.site %>/payment_methods" method="POST" class="samurai <%= classes %>" <%='data-samurai-ajax' if ajax %>>
  <fieldset>
    <input name="redirect_url" type="hidden" value="<%= redirect_url %>" />
    <input name="merchant_key" type="hidden" value="<%= Samurai.options[:merchant_key] %>" />
    <% unless payment_method.token.blank? %><input name="payment_method_token" type="hidden" value="<%= payment_method.token %>" /><% end %>
  </fieldset>

  <fieldset>
    <div class="field-group" id="credit_card_name_group">
      <div>
        <label for="credit_card_first_name">First name</label>
        <input id="credit_card_first_name" name="credit_card[first_name]" size="30" type="text" value="<%= payment_method.first_name %>" />
      </div>
      <div>
        <label for="credit_card_last_name">Last name</label>
        <input id="credit_card_last_name" name="credit_card[last_name]" size="30" type="text" value="<%= payment_method.last_name %>" />
      </div>
    </div>

    <div class="field-group" id="credit_card_address_group">
      <div>
        <label for="credit_card_address_1">Address 1</label>
        <input class="div-6" id="credit_card_address_1" name="credit_card[address_1]" size="30" type="text" value="<%= payment_method.address_1 %>" />
      </div>
      <div>
        <label for="credit_card_address_2">Address 2</label>
        <input class="div-6" id="credit_card_address_2" name="credit_card[address_2]" size="30" type="text" value="<%= payment_method.address_2 %>" />
      </div>
    </div>

    <div class="field-group" id="location_group">
      <div>
        <label for="credit_card_city">City</label>
        <input id="credit_card_city" name="credit_card[city]" size="30" type="text" value="<%= payment_method.city %>" />
      </div>
      <div>
        <label for="credit_card_state">State</label>
        <input class="" id="credit_card_state" name="credit_card[state]" size="30" type="text" value="<%= payment_method.state %>" />
      </div>
      <div>
        <label for="credit_card_zip">Zip</label>
        <input class="" id="credit_card_zip" name="credit_card[zip]" size="30" type="text" value="<%= payment_method.zip %>" />
      </div>
    </div>
  </fieldset>

  <fieldset>
    <div class="field-group" id="credit_card_info_group">
      <div>
        <label for="credit_card_card_number">Card Number</label>
        <input id="credit_card_card_number" name="credit_card[card_number]" size="30" type="text" value="<%= payment_method.card_number %>" autocomplete="off" />
        <label data-samurai-card-previews class="show-accepted">
          <span class='visa'></span>
          <span class='mastercard'></span>
          <span class='amex'></span>
          <span class='discover'></span>
        </label>
      </div>
      <div id="samurai_card_cvv">
        <label for="credit_card_cvv">CVV</label>
        <input class="div-1" id="credit_card_cvv" name="credit_card[cvv]" size="30" type="text" value="<%= payment_method.cvv %>" autocomplete="off" />
      </div>
    </div>
    <div class="field-group" id="credit_card_expiration">
      <div>
        <label for="credit_card_expiry_month">Expires on</label>
        <select id="credit_card_expiry_month" name="credit_card[expiry_month]">
          <option value="1" <%= 'selected' if payment_method.expiry_month.to_s=='1' %>>01</option>
          <option value="2" <%= 'selected' if payment_method.expiry_month.to_s=='2' %>>02</option>
          <option value="3" <%= 'selected' if payment_method.expiry_month.to_s=='3' %>>03</option>
          <option value="4" <%= 'selected' if payment_method.expiry_month.to_s=='4' %>>04</option>
          <option value="5" <%= 'selected' if payment_method.expiry_month.to_s=='5' %>>05</option>
          <option value="6" <%= 'selected' if payment_method.expiry_month.to_s=='6' %>>06</option>
          <option value="7" <%= 'selected' if payment_method.expiry_month.to_s=='7' %>>07</option>
          <option value="8" <%= 'selected' if payment_method.expiry_month.to_s=='8' %>>08</option>
          <option value="9" <%= 'selected' if payment_method.expiry_month.to_s=='9' %>>09</option>
          <option value="10" <%= 'selected' if payment_method.expiry_month.to_s=='10' %>>10</option>
          <option value="11" <%= 'selected' if payment_method.expiry_month.to_s=='11' %>>11</option>
          <option value="12" <%= 'selected' if payment_method.expiry_month.to_s=='12' %>>12</option>
        </select>
        <select id="credit_card_expiry_year" name="credit_card[expiry_year]">
          <option value="2011" <%= 'selected' if payment_method.expiry_year.to_s=='2011' %>>2011</option>
          <option value="2012" <%= 'selected' if payment_method.expiry_year.to_s=='2012' %>>2012</option>
          <option value="2013" <%= 'selected' if payment_method.expiry_year.to_s=='2013' %>>2013</option>
          <option value="2014" <%= 'selected' if payment_method.expiry_year.to_s=='2014' %>>2014</option>
          <option value="2015" <%= 'selected' if payment_method.expiry_year.to_s=='2015' %>>2015</option>
          <option value="2016" <%= 'selected' if payment_method.expiry_year.to_s=='2016' %>>2016</option>
        </select>
      </div>
    </div>
  </fieldset>

  <button type='submit' class='button'>Submit Payment</button>
  <span class='loading' style="display: none;"></span>
  <span class='results' style="display: none;"></span>
</form>
